<ion-header>

  <ion-toolbar>
    <ion-title>Typography</ion-title>
  </ion-toolbar>

</ion-header>


<ion-content padding>

  <h1>H1: The quick brown fox jumps over the lazy dog</h1>

  <h2 ion-text color="primary">H2: The quick brown fox jumps over the lazy dog</h2>

  <h3>H3: The quick brown fox jumps over the lazy dog</h3>

  <h4 ion-text color="danger">H4: The quick brown fox jumps over the lazy dog</h4>

  <h5>H5: The quick brown fox jumps over the lazy dog</h5>

  <h6>H6: The quick brown fox jumps over the lazy dog</h6>

  <p>
    I saw a werewolf with a Chinese menu in his hand.
    Walking through the <sub ion-text color="danger">streets</sub> of Soho in the rain.
    He <i ion-text color="primary">was</i> looking for a place called Lee Ho Fook's.
    Gonna get a <a ion-text color="secondary">big dish of beef chow mein.</a>
  </p>

  <p>
    He's the hairy-handed gent who ran amuck in Kent.
    Lately he's been overheard in Mayfair.
    Better stay away from him.
    He'll rip your lungs out, Jim.
    I'd like to meet his tailor.
    <ion-icon ion-text color="danger" name="cut"></ion-icon>
  </p>

</ion-content>